<template>
	<view class="myorderbox">
		<view class="switchbox">
			<u-tabs :list="jubao_tabslist" :current="jubao_tabs" lineWidth="40" lineColor="#AB87EF"
				:activeStyle="{color: '#8E8E8E',transform: 'scale(0.9)'}"
				:inactiveStyle="{color: '#8E8E8E',transform: 'scale(0.9)'}" @click="jubao_tabsclick($event)">
			</u-tabs>
			<!--      <uni-data-checkbox mode="tag" v-model="jubao_tabs" :localdata="jubao_tabslist"-->
			<!--                         @change="jubao_tabsclick"></uni-data-checkbox>-->
		</view>
		<view class="goods-list">
			<view v-if="jubao_List.length>0" class="goods-list-item" v-for="(item,i) in jubao_List" :key="i">
				<view class="leftbox" @click="goodsClick(item)">
					<view class="imgbox">
						<swiper circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="1000"
							:duration="duration">
							<swiper-item v-for="(img,v) in item.imagelist" :key="v">
								<view 	 class="xy">
									<image mode="scaleToFill" :src="img"></image>
								</view>
							</swiper-item>

						</swiper>
					</view>

					<view class="content">
						<view>商品名称：{{item.goodsname}}</view>
						<view style="word-break: break-all;">举报原因：{{item.jubao_reson}}</view>

					</view>
				</view>
				<view class="rightbox" v-if="item.jubao_state=='1'">
					<view class="top">审核中</view>
					<view class="bottom">
						<u-button type="primary" @click.stop="checkyesClick(item)">同意</u-button>
						<u-button type="primary" @click.stop="checknoClick(item)">拒绝</u-button>
					</view>
				</view>
				<view class="rightbox" v-if="item.jubao_state=='2'">
					<view class="top">已审核</view>
				</view>

			</view>
			<view v-if="jubao_List.length==0" class="shoproempty">
				<shopro-empty :image="mediaUrl + '/media/image/empty_goods.png'" tipText="暂无~"></shopro-empty>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		formatProductName
	} from "../../utils/common";

	export default {
		name: "reportReview",
		data() {
			return {
				jubao_tabs: 0,
				jubao_tabslist: [{
					name: '待审核',
					value: 1
				}, {
					name: '已审核',
					value: 2
				}],
				jubao_List: [],
				mediaUrl: uni.$http.mediaUrl,
			}
		},
		onLoad(e) {},
		onShow() {
			self = this
			switch (this.jubao_tabs) {
				case 0:
					this.jubao_updateList(1);
					break
				case 1:
					this.jubao_updateList(2);
					break
			}
		},
		methods: {
			formatProductName,
			goodsClick(item) {
				uni.navigateTo({
					url: '/pages/home/goodsdetail?goodsid=' + item.goodsid
				})
			},
			jubao_tabsclick(item) {
				console.log(item.index);
				this.jubao_tabs = item.index;
				switch (item.index) {
					case 0:
						this.jubao_updateList(1);
						break;
					case 1:
						this.jubao_updateList(2);
						break;
				}
			},

			// 投诉不成立
			async checknoClick(item) {
				const postmsg = {
					goodsid: item.goodsid,
					check: 0
				}
				const {
					data: res
				} = await uni.$http.post('goodsCheck/', postmsg)
				if (res.code == 200) {
					uni.showToast({
						title: '成功',
						icon: 'success',
						duration: 2000
					});
					this.jubao_updateList(1)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
			// 投诉成立
			async checkyesClick(item) {
				const postmsg = {
					goodsid: item.goodsid,
					check: 2
				}
				const {
					data: res
				} = await uni.$http.post('goodsCheck/', postmsg)
				if (res.code == 200) {
					uni.showToast({
						title: '成功',
						icon: 'success',
						duration: 2000
					});
					this.jubao_updateList(1)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},

			async jubao_updateList(dealstate) {
				const postmsg = {

					check: dealstate
				}
				const {
					data: res
				} = await uni.$http.post('getCheckGoodsList/', postmsg)
				// console.log('myPub_update---',res)
				if (res.code == 200) {
					uni.stopPullDownRefresh(); //上拉停止刷新

					self.jubao_List = []

					for (let i = 0; i < res.data.length; i++) {
						var obj = {}
						obj.id = res.data[i].id
						obj.goodsid = res.data[i].goodsid
						obj.goodsname = res.data[i].goodsname
						obj.goodsdetail = res.data[i].goodsdetail
						obj.imagelist = JSON.parse(res.data[i].imagelist);
						obj.icon = obj.imagelist[0]
						obj.dealstate = res.data[i].dealstate
						obj.date = res.data[i].date
						obj.phonesale = res.data[i].phonesale
						obj.phonebuy = res.data[i].phonebuy

						obj.jubao_reson = res.data[i].jubao_reson;
						obj.jubao_state = res.data[i].jubao_state;

						this.jubao_List.push(obj)
					}

				}
			},

			// 举报不成立
			async tousuno_check(item) {
				const postmsg = {
					id: item.id,
					check: 2
				}
				const {
					data: res
				} = await uni.$http.post('tousuCheck/', postmsg)
				if (res.code == 200) {
					uni.showToast({
						title: '成功',
						icon: 'success',
						duration: 2000
					});
					this.jubao_updateList(0)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
			// 投诉成立
			async tousuyes_check(item) {
				const postmsg = {
					id: item.id,
					check: 1
				}
				const {
					data: res
				} = await uni.$http.post('tousuCheck/', postmsg)
				if (res.code == 200) {
					uni.showToast({
						title: '成功',
						icon: 'success',
						duration: 2000
					});
					this.jubao_updateList(0)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					});
				}
			},
		}
	}
</script>

<style lang="scss">
	.imgbox {
		width: 200rpx;
		height: 130px;
		border-radius: 1px;
	}

	.u-tabs {
		width: 100%;
	}

	.u-tabs__wrapper__nav__item {
		color: #8E8E8E;
		font-size: 24rpx;
		padding-left: 30rpx;
		padding-right: 30rpx;
		width: 308rpx;
		height: 72rpx !important;
		border: 1px solid #BEBEBE;

		&:first-child {
			border-radius: 40rpx 0 0 40rpx;
		}

		&.u-tabs__wrapper__nav__item-1 {
			border-radius: 0 40rpx 40rpx 0;
		}
	}

	.myorderbox {
		height: 40px;
		width: 100%;
		margin-top: 20px;

		.switchbox {
			display: flex;
			justify-content: start;
			width: 100%;
			margin-bottom: 40rpx;
			// background-color: #ff0000;
			padding: 0 10px;
		}

		.goods-list {
			// background-color: #ff0000;
			height: 100%;

			.goods-list-item {
				// background-color: aquamarine;
				width: 100%;
				display: flex;
				justify-content: space-between;
				padding: 5px 4px;
				box-sizing: border-box;
				border-top: 2px solid #eaeaea;
				border-bottom: 2px solid #eaeaea;
				border-left: 2px solid #eaeaea;

				.leftbox {
					// background-color: #00ff00;
					display: flex;

					.imgbox {
						image {
							width: 200rpx;
							height: 200rpx;
							border-radius: 1px;
						}

						swiper {
							height: 120px;
							// width: 100%;
						}
					}

					.content {
						margin-left: 5px;
						font-size: 12px;
						width: 46vw;

						:nth-child(1) {
							font-weight: bold;
						}
					}
				}

				.rightbox {
					max-width: 80px;
					min-width: 80px;
					// background-color: #0000ff;
					display: flex;
					flex-direction: column;
					justify-content: space-between;

					.top {
						font-weight: bold;
						font-size: 12px;
						color: #e34e4e;
					}

					.bottom {
						font-size: 12px;
						color: #fff;
						// background-color: #169bd5;
						border-radius: 5px;
						text-align: center;
						display: flex;
						flex-direction: column;

						:nth-child(1) {
							height: 26px;
						}

						:nth-child(2) {
							height: 26px;
							margin-top: 6px;
						}

						:nth-child(3) {
							height: 26px;
							margin-top: 6px;
						}
					}
				}
			}

			.shoproempty {
				// background-color: #ff0000;
				width: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}

		.upopupbox {
			width: 600rpx;
			padding-bottom: 50rpx;
			margin-top: 0px;
			padding: 30rpx 30rpx;
			box-sizing: border-box;

			.titlebox {
				font-size: 18px;
				display: flex;
				justify-content: center;
			}

			.codebox {
				margin-top: 40rpx;
				margin-bottom: 40rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #545454;

				input {
					background-color: #lightgray;
					width: 160px;
					padding: 4px;
					margin-left: 10px;
				}
			}

			.buttonbox {
				margin-bottom: 10rpx;
				background: -webkit-linear-gradIEnt(left, #6C64D0, #8481C8) !important;
			}
		}
	}
</style>